<html lang="zh-CN"><head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>父亲节快乐</title>
  <script src="https://cdn.tailwindcss.com"></script>
  <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
  
  <!-- Tailwind 配置 -->
  <script>
    tailwind.config = {
      theme: {
        extend: {
          colors: {
            primary: '#3A86FF',
            love: '#FF006E',
          },
        },
      }
    }
  </script>
</head>
<body class="bg-gradient-to-br from-blue-50 to-pink-50 min-h-screen flex items-center justify-center p-4">
  <!-- 主容器 -->
  <div class="max-w-2xl w-full text-center">
    <!-- 标题 -->
    <h1 class="text-[clamp(2rem,8vw,3.5rem)] font-bold text-primary mb-4">
      父亲节快乐
    </h1>
    
    <!-- 爱心装饰 -->
    <div class="mb-6 text-7xl text-love animate-pulse">
      <i class="fa fa-heart"></i>
    </div>
    
    <!-- 祝福语 -->
    <p class="text-[clamp(1.2rem,4vw,1.8rem)] text-gray-700 mb-8">
      爸爸，我爱您！
    </p>
    
    <!-- 简短寄语 -->
    <div class="bg-white/80 backdrop-blur-sm rounded-xl shadow-lg p-5 mb-8">
      <p class="text-gray-700 italic">
        "感谢您的爱与支持，祝您父亲节快乐！"
      </p>
    </div>
    
    <!-- 底部装饰 -->
    <div class="text-center">
      <div class="flex justify-center space-x-2 mb-4">
        <i class="fa fa-heart text-love animate-pulse"></i>
        <i class="fa fa-heart text-love animate-pulse" style="animation-delay: 0.2s;"></i>
        <i class="fa fa-heart text-love animate-pulse" style="animation-delay: 0.4s;"></i>
      </div>
      <p class="text-gray-500 text-sm">父亲节快乐 · 2025</p>
    </div>
  </div>


</body></html>